<template>
    <div>
      <van-nav-bar title="积分记录"  left-arrow   @click-left="$router.go(-1)"></van-nav-bar>
      <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">  <!-- @load="onLoad" -->
        <van-cell v-for="item in matterslist" :key="item.id">
            <div class="party" >
                <div class="fl ">{{item.type}}</div>
                <div class="fr obtain">获得{{item.count}}积分</div>
            </div>
            <p class="dataName">{{item.createDate}}</p>
        </van-cell>
      </van-list>
    </div>
</template>
<script>
import apiHttp from '../../../../api/index'
export default {
    data() {
        return {
            loading: false,
            finished: false,
            matterslist:[],
            page:1,
            pageSize:10,
            userId:sessionStorage.getItem('userId'),
            total:0,
        }
    },
    methods:{
        onLoad(){
            this.getMyRecord()
            if(this.matterslist.length >= this.total){
                this.finished  = true
          		this.loading = false 
            }else{
                this.page++
                this.getMyRecord()
            }
        },
        getMyRecord(){
            let parmes = {
                page:this.page,
                pageSize:this.pageSize,
                userId:this.userId
            }
            apiHttp.comIndex.getMyRecord(parmes,resp=>{
                if(resp.resultCode == '000000'){
                    this.total = resp.data.total
                    for(let i = 0; i < resp.data.recordList.length; i++){
                        resp.data.recordList[i].createDate = resp.data.recordList[i].createDate.slice(0,10)
                        this.matterslist.push(resp.data.recordList[i])
                    }
                    this.loading = false 
                }else{
                  Toast(resp.resultMsg)
                }
            })
        }
    },
}
</script>
<style scoped>
@import '../../../../assets/css/community/listIntroduction/guide.css'; 
.party{
    width: 92%;
    margin: .4rem auto;
    border-radius: 5px;
    /* padding: 0.4rem 0.5rem; */
    background-color: #ffffff;
} 
.party::after {
    overflow: hidden;
    content: "";
    display: block;
    height: 0;
    clear: both;
}
.obtain{
    color:#FF7F39;
}
.van-cell::after {
    content: ' ';
    position: absolute;
    pointer-events: none;
    box-sizing: border-box;
    left: 15px;
    right: 0;
    bottom: 0;
    -webkit-transform: scaleY(.5);
    transform: scaleY(.5);
    border-bottom: 0px solid #ebedf0;
}
.van-cell{
    margin-bottom: 0;
}
.dataName{
    color: #999999;
    font-size: .4rem;
    width: 92%;
    margin: 0.2rem auto;
}
</style>

